<template>
  <div>
    <div class="btn">
      <el-button type="primary" @click="showfrom">添加</el-button>
    </div>
    <list :bannerArr="bannerArr" @updataBanner="updataBanner" @canle="canle"></list>
    <forms :obj="obj" @addBanner="addBanner" @canle="canle" ref="curid"></forms>
  </div>
</template>

<script>
import list from "./list.vue";
import forms from "./form.vue";
import { bannerlist } from "../../request/api.js";
export default {
  components: {
    list,
    forms,
  },
  data() {
    return {
      obj: {
        isshow: false,
      },
      bannerArr: [],
    };
  },
  methods: {
    updataBanner(id) {
      this.obj.isshow = true;
      this.$refs.curid.getOneBanner(id);
    },
    canle() {
      this.obj.isshow = false;
      this.getBannerList();
    },
    addBanner() {
      this.obj.isshow = false;
      this.getBannerList();
    },
    showfrom() {
      this.obj.isshow = true;
    },
    getBannerList() {
      bannerlist().then((d) => {
        if (d.data.code == 200) {
          this.bannerArr = d.data.list;
        }
      });
    },
  },
  mounted() {
    this.getBannerList();
  },
};
</script>

<style>
.cell {
  text-align: center;
}
.btn {
  margin: 30px 0;
}
</style>